-
Notifications
You must be signed in to change notification settings - Fork 5
/
ViewerPaginator.svelte
48 lines (40 loc) · 1.21 KB
/
ViewerPaginator.svelte
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!-- @component
ViewerPaginator wraps the common paginator with viewer-specific state and functions
-->
<script context="module" lang="ts">
import { writable, type Writable } from "svelte/store";
import { replaceState } from "$app/navigation";
import { pageHashUrl } from "$lib/api/documents";
import { scrollToPage } from "$lib/utils/scroll";
export const currentPage: Writable<number> = writable(1);
</script>
<script lang="ts">
import Paginator from "@/common/Paginator.svelte";
export let totalPages: number;
// pagination
function next() {
$currentPage = Math.min($currentPage + 1, totalPages);
scrollToPage($currentPage);
replaceState(pageHashUrl($currentPage), {});
}
function previous() {
$currentPage = Math.max($currentPage - 1, 1);
scrollToPage($currentPage);
replaceState(pageHashUrl($currentPage), {});
}
function gotoPage(n: number) {
$currentPage = n;
scrollToPage($currentPage);
replaceState(pageHashUrl($currentPage), {});
}
</script>
<Paginator
goToNav
on:goTo={(e) => gotoPage(e.detail)}
on:next={next}
on:previous={previous}
bind:page={$currentPage}
{totalPages}
has_next={$currentPage < totalPages}
has_previous={$currentPage > 1}
/>